@import '@styles/index.scss';
.container {
  height: 45px;
  padding: 0 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--font-size-label);
  border-bottom: 1px solid var(--border-line-color);
  background: var(--color-white);
  position: relative;

  .category {
    line-height: 1;
    display: flex;
    align-items: center;

    .icon {
      margin-right: 6px;
      color: $icon-color;
    }

    .text {
      margin-right: 8px;
      font-size: $font-size-small;
      color: $text-color-primary;
    }
  }

  .plug-icon {
    margin-left: 16px;
    margin-right: 8px;
    color: $icon-color;
    &.active {
      color: $icon-color-active;
    }
  }

  .plugin-icon-container {
    background: $white;
    z-index: 10;
    height: 28px;
    position: absolute;
    right: 16px;
    left: 16px;

    .plugin-icon {
      float: left;
      height: 100%;
      display: flex;
      align-items: center;
    }

    .switcher {
      float: right;
      width: 35px;
      margin: 4px 0;
      border-left: 1px solid var(--border-line-color);
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
}

.icon-color {
  color: $icon-color;
}